/* =============================================================================================================================*/
@import url("cst_web_gris.css");

/* * { -webkit-user-select: none; } */

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: black;
  opacity: 0.5; /* Firefox */
  font-style: italic;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: black;
  opacity: 0.5;
  font-style: italic;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: black;
  opacity: 0.5;
  font-style: italic;
}
 
/* =============================================================================================================================*/

input[type="checkbox"]:required:invalid + label { color: red; }
input[type="checkbox"]:required:valid + label { color: green; }

form input[type='text'] {
/*form input:not(:readonly, [type='text']) {*/
	margin: 20px 0px 0px; 
	padding: 0px 10px;
	border-radius: 3px; 
	border: 1px solid rgb(218, 218, 218);
	border-image: none; 
	width: 100%; 
	height: 42px; 
	color: rgb(88, 88, 88); 
	font-family: "Open Sans"; 
	font-size: 14px; 
	font-weight: 400; 
	box-sizing: border-box;
}

form span[type='text'] {
	background: rgb(255, 255, 255); 
	margin: 20px 0px 0px; 
	padding: 0px 10px; /*0px 20px; */
	border-radius: 3px; 
	border: 1px solid rgb(218, 218, 218);
	border-image: none; 
	width: 100%; 
	height: 42px; 
	color: rgb(88, 88, 88); 
	font-family: "Open Sans"; 
	font-size: 14px; 
	font-weight: 400; 
	box-sizing: border-box;
}

form input[type='email'] {
	background: rgb(255, 255, 255); margin: 20px 0px 0px; padding: 0px 20px; border-radius: 3px; border: 1px solid rgb(218, 218, 218); border-image: none; width: 100%; height: 42px; color: rgb(88, 88, 88); font-family: "Open Sans"; font-size: 14px; font-weight: 400; box-sizing: border-box;
}
form input[type='password'] {
	background: rgb(255, 255, 255); margin: 20px 0px 0px; padding: 0px 20px; border-radius: 3px; border: 1px solid rgb(218, 218, 218); border-image: none; width: 100%; height: 42px; color: rgb(88, 88, 88); font-family: "Open Sans"; font-size: 14px; font-weight: 400; box-sizing: border-box;
}
form input[type='url'] {
	background: rgb(255, 255, 255); margin: 20px 0px 0px; padding: 0px 20px; border-radius: 3px; border: 1px solid rgb(218, 218, 218); border-image: none; width: 100%; height: 42px; color: rgb(88, 88, 88); font-family: "Open Sans"; font-size: 14px; font-weight: 400; box-sizing: border-box;
}
form input[type='tel'] {
	background: rgb(255, 255, 255); margin: 20px 0px 0px; padding: 0px 20px; border-radius: 3px; border: 1px solid rgb(218, 218, 218); border-image: none; width: 100%; height: 42px; color: rgb(88, 88, 88); font-family: "Open Sans"; font-size: 14px; font-weight: 400; box-sizing: border-box;
}
form input[type='number'] {
	background: rgb(255, 255, 255); 
	margin: 0px 0px 0px; 
	padding: 0px 20px; 
	border-radius: 3px; 
	border: 1px solid rgb(218, 218, 218); 
	border-image: none; 
	width: 25%; 
	height: 2em; /*42px;*/ 
	color: rgb(88, 88, 88); 
	font-family: "Open Sans"; 
	font-size: 14px; 
	font-weight: 400; 
	box-sizing: border-box;
}
form input[type='range'] {
	background: rgb(255, 255, 255); margin: 20px 0px 0px; padding: 0px 20px; border-radius: 3px; border: 1px solid rgb(218, 218, 218); border-image: none; width: 100%; height: 42px; color: rgb(88, 88, 88); font-family: "Open Sans"; font-size: 14px; font-weight: 400; box-sizing: border-box;
}
form input[type='date'] {
	background: rgb(255, 255, 255); margin: 20px 0px 0px; padding: 0px 20px; border-radius: 3px; border: 1px solid rgb(218, 218, 218); border-image: none; width: 100%; height: 42px; color: rgb(88, 88, 88); font-family: "Open Sans"; font-size: 14px; font-weight: 400; box-sizing: border-box;
}
form input[type='file'] {
	background: rgb(255, 255, 255); 
	margin: 20px 0px 0px; 
	padding: 0px 20px; 
	border-radius: 3px; 
	border: 1px solid rgb(218, 218, 218); 
	border-image: none; 
	width: 100%; 
	height: 42px; 
	color: #5f5f5f; /*rgb(88, 88, 88); */
	font-family: "Open Sans"; 
	font-size: 14px; 
	font-weight: 400; 
	box-sizing: border-box;
}

form select {
	background: 0px 0px rgb(255, 255, 255); 
	margin: 4px 0px 0px; /*4 0 0*/
	padding: 0px 16px; 
	border-radius: 3px; 
	border: 1px solid rgb(218, 218, 218); 
	border-image: none; 
	width: 100%; 
	height: 60px; 
	color: #5f5f5f;
	font-size: 14px; 
	font-weight: 400; 
	/*box-shadow: inset 0px 1px 3px 0px #dadada; 
	-moz-box-shadow: 0 1px 3px 0 #dadada inset; 
	-webkit-box-shadow: 0 1px 3px 0 #dadada inset;*/
}


form textarea {
	background: rgb(255, 255, 255); padding: 15px 20px; border-radius: 3px; border: 1px solid rgb(218, 218, 218); border-image: none; width: 100%; height: auto; color: rgb(38, 38, 38); font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 400; margin-top: 4px; margin-bottom: 0px; box-sizing: border-box;
}
form input[type='submit'] {
	background: 0px 0px rgb(38, 38, 38); padding: 0px; border-radius: 3px; border: currentColor; transition:0.3s linear; border-image: none; width: 100%; height: 50px; color: rgb(255, 255, 255); font-family: "Open Sans"; font-size: 20px; font-weight: 400; margin-top: 0px; display: inline-block; position: relative; cursor: pointer; -webkit-transition: all 0.3s linear 0s; -moz-transition: all 0.3s linear 0s; -o-transition: all 0.3s linear 0s;
}

/**/
/* hover state */
/**/

.mon-form {
	padding: 0; /*40px;*/
	max-width:600px;
	margin: 8px auto; /*40px auto;*/
	outline:none;
	background: rgba(255,255,255); /*AJOUT 22/12/14 ,.9*/
	border-radius:4px;
	box-shadow:0 0 20px rgba(0,0,0,.3);
	font: 13px/1.55 'Open Sans', Helvetica, Arial, sans-serif;
	color: var( --e-global-couleur-form );
	max-width: 1200px; /*new 22/03/27*/
}

.mon-form h1 {
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	outline:none;
	color:inherit;
	margin-top:20px;
	margin-bottom:10px;
	padding : 0px;
	font: 36px/39px 'Open Sans', Helvetica, Arial, sans-serif;
	text-align:center;
	vertical-align : baseline;
	appearance:normal;
	-moz-appearance:none;
	-webkit-appearance:none;
}	

.mon-form .req_pass{
	background:#3caf1d;
}

.mon-form .req_pass1:hover,.req_pass1:focus{
		background:#0e8a29;
}

.mon-form .number {
	width: 100%;
	padding-left:10px;
	margin-top:0;
	height:2em;
	float:right;
	right:5px;
}

.mon-form label.number span{
	width: 70%;
	padding:0px;
	margin: 0px 20px;
	font-size: 15px; 
	/*float:right;*/

}
/**/
/* focus state */
/**/


/**/
/* checked state */
/**/
.mon-form .radio input + i:after {
	background-color: #b3b3b3;	
	transform: scale(1.5);
}
.mon-form .checkbox input + i:after {
	color: #b3b3b3;
}
.mon-form .radio input:checked + i,
.mon-form .checkbox input:checked + i,
.mon-form .toggle input:checked + i {
	border-color: #b3b3b3;	
}

.mon-form .radio input:checked + i {
	padding : 3px;
}


.mon-form .rating input:checked ~ label {
	color: #b3b3b3;	
}

.mon-form header {
	display: block;
	/*padding: 14px 30px;	20 30*/
	border-bottom: 1px solid rgba(0,0,0,.1);
	background: rgba(248,248,248,.9);
	font-size: 25px;
	font-weight: 300;
	color: #5f5f5f;
}
.mon-form header:after {
	content: '';
	display: table;
	clear: both;
}
.mon-form fieldset {
	display: block;	
	text-align : start;
	padding: 3px 30px 3px; /*5 30 5*/
	border: none;
	background: rgba(255,255,255,.9);
}

.mon-form fieldset + fieldset {
	border-top: 1px solid rgba(0,0,0,.1);
}

.mon-form fieldset legend {
	font-size:1.2em;
	text-transform:none;
	font-weight:700;
	border:none;
	background:rgba(255, 255, 255, 0.48);
}

/*.mon-form fieldset label {
	margin : 0px;
	padding : 0px;
}*/

.mon-form section{margin-bottom:4px;}

.mon-form footer {
	display: block;
	 /* padding: 15px;30px 25px*/
	border-top: 1px solid rgba(0,0,0,.1);
	background: rgba(248,248,248,.9);
	font-size: 25px;
	font-weight: 300;
	color: #5f5f5f;
}
.mon-form footer:after {
	content: '';
	display: table;
	clear: both;
}

.mon-form a {
	color: #5f5f5f;
}
.mon-form .label {
	display: block;
	margin-bottom: 6px;
	line-height: 19px;
	font-size: 1.1em;
}
.mon-form .label.col {
	margin: 0;
	padding-top: 10px;
}
.mon-form .note {
	margin-top: 6px;
	padding: 0 1px;
	font-size: 16px; /*11*/
	line-height: 15px;
	color: #5f5f5f;
}
.mon-form .input,
.mon-form .number,
.mon-form .select,
.mon-form .textarea,
.mon-form .radio,
.mon-form .checkbox,
.mon-form .toggle,
.mon-form .button {
	position: relative;
	display: block;
}

.mon-form .input input,
.mon-form .textarea textarea {
	display:block;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	/*min-width: 145px;*/
	width:100%;
	height:39px;
	padding:8px 10px;
	outline:none;
	border-width:2px;
	border-style:solid;
	border-radius:0;
	background:#fff;
	font:15px/19px 'Open Sans', Helvetica, Arial, sans-serif;
	color: #5f5f5f;
	appearance:normal;
	-moz-appearance:none;
	-webkit-appearance:none;
}

.mon-form .select select {
	display:block;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	min-width: 145px;
	width:100%;
	height: 43px; /*39px;*/
	padding: 10px;  /*0px 0px 0px 8px;*/
	outline:none;
	border-width:2px;
	border-style:solid;
	border-radius:0;
	background:#fff;
	font:15px/19px 'Open Sans', Helvetica, Arial, sans-serif;
	color: #5f5f5f;
	appearance:normal;
	-moz-appearance:none;
	-webkit-appearance:none;
}

/**/
/* selects */
/**/
.mon-form .select i {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 5px;
	height: 11px;
	background: #fff;
	box-shadow: 0 0 0 12px #fff;
}

.mon-form .select i:after,
.mon-form .select i:before {
	content: '';
	position: absolute;
	right: 0;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}
.mon-form .select i:after {
	bottom: 0;
	border-top: 4px solid #5f5f5f;
}
.mon-form .select i:before {
	top: 0;
	border-bottom: 4px solid #5f5f5f;
}
.mon-form .select-multiple select {
	height: auto;
}

/**/
/* textareas */
/**/
.mon-form .textarea textarea {
	height: auto;
	resize: none;
}
.mon-form .textarea-resizable textarea {
	resize: vertical;	
}
.mon-form .textarea-expandable textarea {
	height: 35px;
}
.mon-form .textarea-expandable textarea:focus {
	height: auto;
}

.mon-form .textarea .icon-prepend + textarea {
	padding-left: 46px;
}
.mon-form .textarea .icon-append + textarea {
	padding-right: 46px;
}
.mon-form .textarea .icon-prepend + .icon-append + textarea {
	padding-left: 46px;
}

.mon-form .icon-append_l {
		top: 3px !important;
}

.mon-form .textarea textarea:focus + .tooltip {
	opacity: 1;	
	z-index : 100;
	transform-style: preserve-3d;
}
.mon-form .textarea textarea:focus + .tooltip-top-right {
	right: 0;
	left: auto;
	margin-bottom: 5px;
}
.mon-form .textarea textarea:focus + .tooltip-top-left {
	right: auto;
	left: 0;
	margin-bottom: 5px;
}
.mon-form .textarea textarea:focus + .tooltip-right {
	left: 100%;
	margin-left: 5px;
}
.mon-form .textarea textarea:focus + .tooltip-left {
	right: 100%;
	left: auto;
	margin-right: 5px;
}
.mon-form .textarea textarea:focus + .tooltip-bottom-right {
	right: 0;
	left: auto;
	margin-top: 5px;
}

.mon-form .textarea textarea:focus + .tooltip-bottom-left {
	right: auto;
	left: 0;
	margin-top: 5px;
}

/**/
/* radios and checkboxes */
/**/
/*.mon-form .checkbox{ text-align:left;}*/
.mon-form .radio,
.mon-form .checkbox {
	margin-bottom: 4px;
	padding-left: 27px;
	font-size: 15px;
	line-height: 27px;
	color: #5f5f5f;
	cursor: pointer;
}
.mon-form .radio:last-child,
.mon-form .checkbox:last-child {
	margin-bottom: 0;
}
.mon-form .radio input,
.mon-form .checkbox input {
	position: absolute;
	left: -9999px;
}
.mon-form .radio i,
.mon-form .checkbox i {
	position: absolute;
	top: 5px;
	left: 0;
	display: block;
	width: 13px;
	height: 13px;
	outline: none;
	border-width: 2px;
	border-style: solid;
	background: #fff;
}

.mon-form .radio i {
	border-radius: 50%;
	width : 17px; /*new 22/03/27*/
	height: 17px; /*new 22/03/27*/

}
.mon-form .radio input + i:after,
.mon-form .checkbox input + i:after {
	position: absolute;
	opacity: 0;
	transition: opacity 0.1s;
	-o-transition: opacity 0.1s;
	-ms-transition: opacity 0.1s;
	-moz-transition: opacity 0.1s;
	-webkit-transition: opacity 0.1s;
}
.mon-form .radio input + i:after {
	content: '';
	top: 4px;
	left: 4px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
}
.mon-form .checkbox input + i:after {
	content: '\f00c';
	top: -1px;
	left: -1px;
	width: 15px;
	height: 15px;
	font: normal 12px/16px "Font Awesome 6 Free";
	text-align: center;
}
.mon-form .radio input:checked + i:after,
.mon-form .checkbox input:checked + i:after {
	opacity: 1;
}
.mon-form .inline-group {
	/*margin: 0 -30px -4px 0;*/
}
.mon-form .inline-group:after {
	content: '';
	display: table;
	clear: both;
}
.mon-form .inline-group .radio,
.mon-form .inline-group .checkbox {
	float: left;
	margin-right: 30px;
}
.mon-form .inline-group .radio:last-child,
.mon-form .inline-group .checkbox:last-child {
	margin-bottom: 4px;
}

/**/
/* toggles */
/**/
.mon-form .toggle {
	margin-top : 20px;	/*new 22/03/27*/
	margin-bottom: 4px;
	padding-right: 20px;	/*61 20*/
	font-size: 15px;
	line-height: 27px;
	color: #5f5f5f;
	cursor: pointer;
}
.mon-form .toggle:last-child {
	margin-bottom: 0;
}
.mon-form .toggle input {
	position: absolute;
	left: -9999px;
}

.mon-form .toggle i {
	content: '';
	position: absolute;
	top: 4px;
	right: 0;
	/*left : 50px; 	new 22/03/27*/
	display: block;
	width: 49px;
	height: 17px;
	border-width: 2px;
	border-style: solid;
	border-radius: 12px;
	background: #fff;
}
.mon-form .toggle i:after {
	content: 'OFF';
	position: absolute;
	top: 0px; /*2px;*/
	right: 8px;
	left: 8px;
	font-style: normal;
	font-size: 9px;
	line-height: 13px;
	font-weight: 700;
	text-align: left;
	color: #5f5f5f;
}
.mon-form .toggle i:before {
	content: '';
	position: absolute;
	z-index: 1;
	top: 2px;
	bottom: 2px;
	right: 4px;	
	display: block;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	opacity: 1;
	background-color: #b3b3b3;	
	transition: right 0.2s;
	-o-transition: right 0.2s;
	-ms-transition: right 0.2s;
	-moz-transition: right 0.2s;
	-webkit-transition: right 0.2s;
}
.mon-form .toggle input:checked + i:after {
	content: 'ON';
	text-align: right;
	left : 4px;
}
.mon-form .toggle input:checked + i:before {
	right: 36px;
}

/**/
/* ratings */
/**/
.mon-form .rating {
	margin-bottom: 4px;
	font-size: 15px;
	line-height: 27px;
	color: #5f5f5f;
}
.mon-form .rating:last-child {
	margin-bottom: 0;
}
.mon-form .rating input {
	position: absolute;
	left: -9999px;
}
.mon-form .rating label {
	display: block;
	float: right;
	height: 17px;
	margin-top: 5px;
	padding: 0 2px;
	font-size: 17px;
	line-height: 17px;
	cursor: pointer;
}

.mon-form [class^="fa-"],
.ui-datepicker [class^="fa-"] {
  font-family: "Font Awesome 6 Free";
  font-style: normal;
  font-weight: normal;
  -webkit-font-smoothing: antialiased;
}

.mon-form [class^="icon-"]{
		/*font-family:"Font Awesome 6 Free";
		font-style:normal;
		font-weight:normal;*/
		-webkit-font-smoothing:antialiased;
}

.mon-form .icon-append,
.mon-form .icon-prepend {
	position: absolute;
	top: 5px;
	width: 29px;
	height: 29px;
	color: rgb(24, 23, 23);
	font-size: 15px;;
	line-height: 29px;
	text-align: center;
}
.mon-form .icon-append {
	right: 5px;
	padding-left: 3px;
	border-left-width: 1px;
	border-left-style: solid;
}
.mon-form .icon-prepend {
	left: 5px;
	padding-right: 3px;
	border-right-width: 1px;
	border-right-style: solid;
}
.mon-form .input .icon-prepend + input,
.mon-form .textarea .icon-prepend + textarea {
	padding-left: 46px;
}
.mon-form .input .icon-append + input,
.mon-form .textarea .icon-append + textarea {
	padding-right: 20px; /*46px;*/
}
.mon-form .input .icon-prepend + .icon-append + input,
.mon-form .textarea .icon-prepend + .icon-append + textarea {
	padding-left: 46px;
}

/**/
/* grid */
/**/
.mon-form .row {
	margin: 0 -15px;
}
.mon-form .row:after {
	content: '';
	display: table;
	clear: both;
}
.mon-form .col {
	float: left;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 15px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}

.mon-form .col-10 {
	width: 10%;
	max-width : 10%;
}
.mon-form .col-1, .col-12 {
	width: 12%;
}
.mon-form .col-2, .col-16 {
	width: 16.66%;
}
.mon-form .col-18 {
	width: 18%;
}
/*.mon-form .col-3 {
	width: 25%;
}*/
.mon-form .col-33 {
	width: 33.33%; 
}
.mon-form .col-5, .col-42 {
	width: 41.66%;
}
.mon-form .col-60 {
	width: 62%;
}
.mon-form .col-8, .col-66 {
	width: 66.67%;
}
.mon-form .col-75 {
	width: 75%;
}
.mon-form .col-10, .col-83 {
	width: 83.33%;
}
.mon-form .col-20 {
	width: 20%;
}
.mon-form .col-25 {
	width: 25%;
}
.mon-form .col-30 {
	width: 30%;
}
.mon-form .col-50 {
	width: 50%;
}
.mon-form .col-100{
	width: 100%;
}

/**/
/* tooltips */
/**/

.mon-form .tooltip {
	position: absolute;
	z-index: 1;
	left: -9999px;
	padding: 2px 8px 3px;
	font-size: 11px;
	line-height: 16px;
	font-weight: 400;
	background: rgba(0,0,0,0.9);
	color: #fff;
	opacity: 1;
	transition: margin 0.3s, opacity 0.3s;
	-o-transition: margin 0.3s, opacity 0.3s;
	-ms-transition: margin 0.3s, opacity 0.3s;
	-moz-transition: margin 0.3s, opacity 0.3s;
	-webkit-transition: margin 0.3s, opacity 0.3s;
}
.mon-form .tooltip:after {
	content: '';
	position: absolute;
}
.mon-form .input input:focus + .tooltip,
.mon-form .textarea textarea:focus + .tooltip {
	opacity: 1;	
}

/* top right */
.mon-form .tooltip-top-right {
	bottom: 100%;
	margin-bottom: 15px;
}
.mon-form .tooltip-top-right:after {
	top: 100%;
	right: 16px;	
	border-top: 4px solid rgba(0,0,0,0.9);
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}
.mon-form .input input:focus + .tooltip-top-right,
.mon-form .textarea textarea:focus + .tooltip-top-right {
	right: 0;
	left: auto;
	margin-bottom: 2px;
}

/* top left */
.mon-form .tooltip-top-left {
	bottom: 100%;
	margin-bottom: 15px;
}
.mon-form .tooltip-top-left:after {
	top: 100%;
	left: 16px;
	border-top: 4px solid rgba(0,0,0,0.9);
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}
.mon-form .input input:focus + .tooltip-top-left,
.mon-form .textarea textarea:focus + .tooltip-top-left {
	right: auto;
	left: 0;
	margin-bottom: 5px;
}

/* right */
.mon-form .tooltip-right {
	top: 9px;
	white-space: nowrap;
	margin-left: 15px;
}
.mon-form .tooltip-right:after {
	top: 6px;
	right: 100%;
	border-top: 4px solid transparent;
	border-right: 4px solid rgba(0,0,0,0.9);
	border-bottom: 4px solid transparent;
}
.mon-form .input input:focus + .tooltip-right,
.mon-form .textarea textarea:focus + .tooltip-right {
	left: 100%;
	margin-left: 5px;
}
/* top left */
.mon-form .tooltip-left {
	top: 9px;
	white-space: nowrap;
	margin-right: 15px;
}
.mon-form .tooltip-left:after {
	top: 6px;
	left: 100%;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid rgba(0,0,0,0.9);
}
.mon-form .input input:focus + .tooltip-left,
.mon-form .textarea textarea:focus + .tooltip-left {
	right: 100%;
	left: auto;
	margin-right: 5px;
}
/* bottom right */
.mon-form .tooltip-bottom-right {
	top: 100%;
	margin-top: 15px;
}
.mon-form .tooltip-bottom-right:after {
	bottom: 100%;
	right: 16px;	
	border-right: 4px solid transparent;
	border-bottom: 4px solid rgba(0,0,0,0.9);
	border-left: 4px solid transparent;
}
.mon-form .input input:focus + .tooltip-bottom-right,
.mon-form .textarea textarea:focus + .tooltip-bottom-right {
	right: 0;
	left: auto;
	margin-top: 5px;
}
/* top left */
.mon-form .tooltip-bottom-left {
	top: 100%;
	margin-top: 15px;
}
.mon-form .tooltip-bottom-left:after {
	bottom: 100%;
	left: 16px;
	border-right: 4px solid transparent;
	border-bottom: 4px solid rgba(0,0,0,0.9);
	border-left: 4px solid transparent;
}
.mon-form .input input:focus + .tooltip-bottom-left,
.mon-form .textarea textarea:focus + .tooltip-bottom-left {
	right: auto;
	left: 0;
	margin-top: 5px;
}
/**/
/* normal state */
/**/
.mon-form .input input,
.mon-form .select select,
.mon-form .textarea textarea,
.mon-form .radio i,
.mon-form .checkbox i,
.mon-form .toggle i,
.mon-form .icon-append,
.mon-form .icon-prepend {
	border-color: #e5e5e5;
	transition: border-color 0.3s;
	-o-transition: border-color 0.3s;
	-ms-transition: border-color 0.3s;
	-moz-transition: border-color 0.3s;
	-webkit-transition: border-color 0.3s;
}
.mon-form .toggle i:before {
	background-color: var( --e-global-bouton-arriere ); 	
}
.mon-form .rating label {
	color: #ccc;
	transition: color 0.3s;
	-o-transition: color 0.3s;
	-ms-transition: color 0.3s;
	-moz-transition: color 0.3s;
	-webkit-transition: color 0.3s;
}
/* buttons */
.mon-form .button{
    border:0;
	outline:none;
	border-radius:0;
	padding: 1px, 6px, 1px, 6px; 
    font-size: 3rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .1em;
	color:#fff;
/*	-webkit-transition:all 0.5s ease;
	transition:all 0.5s ease;*/
	-webkit-appearance: none;
	background-color: var( --e-global-bouton-arriere ); 
	opacity: 0.8;
	transition: opacity 0.2s;
	-o-transition: opacity 0.2s;
	-ms-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	-webkit-transition: opacity 0.2s;
}
.mon-form .button-block{display:block;width:100%;}
.mon-form .button-block-pass{font-size:1.2rem;display:block;width:100%;}

.mon-form .button.button-secondary {
	background-color: #b3b3b3;
}
.mon-form .button-small{float:left;margin-top:11px;padding:1px;font-size: 32px;color:white;border-radius:4px;}
/**/
/* hover state */
/**/
.mon-form .input:hover input,
.mon-form .select:hover select,
.mon-form .textarea:hover textarea,
.mon-form .radio:hover i,
.mon-form .checkbox:hover i,
.mon-form .toggle:hover i {
	border-color: var( --e-global-bouton-hover ); 
}
.mon-form .rating input + label:hover,
.mon-form .rating input + label:hover ~ label {
	color:  var( --e-global-bouton-hover ); 
}
.mon-form .button:hover {
	opacity: 1; 
	background: var( --e-global-bouton-hover ); 
}

/**/
/* checked state */
/**/
.mon-form .radio input + i:after {  
	background-color: var( --e-global-input-checked );
}
.mon-form .checkbox input + i:after {
	color: var( --e-global-input-checked );
}
.mon-form .radio input:checked + i,
.mon-form .checkbox input:checked + i,
.mon-form .toggle input:checked + i {
	border-color: var( --e-global-input-checked );
}
.mon-form .rating input:checked ~ label {
	color: var( --e-global-input-checked );
}

/**/
/* error state */
/**/
.mon-form .state-error input,
.mon-form .state-error select,
.mon-form .state-error textarea,
.mon-form .radio.state-error i,
.mon-form .checkbox.state-error i,
.mon-form .toggle.state-error i {
	background: var( --e-global-input-error );
}
.mon-form .state-error select + i {
	background:  var( --e-global-input-error );
	box-shadow: 0 0 0 12px #fff0f0;
}
.mon-form .toggle.state-error input:checked + i {
	background: var( --e-global-input-error );
}
.mon-form .state-error + em {
	display: block;
	margin-top: 6px;
	padding: 0 1px;
	font-style: normal;
	font-size: 11px;
	line-height: 15px;
	color: var( --e-global-input-error );
}
.mon-form .rating.state-error + em {
	margin-top: -4px;
	margin-bottom: 4px;
}

/**/
/* success state */
/**/
.mon-form .state-success input,
.mon-form .state-success select,
.mon-form .state-success textarea,
.mon-form .radio.state-success i,
.mon-form .checkbox.state-success i,
.mon-form .toggle.state-success i {
	background: var( --e-global-input-success );
}
.mon-form .state-success select + i {
	background: var( --e-global-input-success );
	box-shadow: 0 0 0 12px #f0fff0;
}
.mon-form .toggle.state-success input:checked + i {
	background: var( --e-global-input-success );
}
.mon-form .note-success {
	color: var( --e-global-input-success );
}

/**/
/* disabled state */
/**/
.mon-form .input.state-disabled input,
.mon-form .select.state-disabled,
.mon-form .textarea.state-disabled,
.mon-form .radio.state-disabled,
.mon-form .checkbox.state-disabled,
.mon-form .toggle.state-disabled,
.mon-form .button.state-disabled {
	cursor: default;
	opacity: 0.5;
}
.mon-form .input.state-disabled:hover input,
.mon-form .select.state-disabled:hover select,
.mon-form .textarea.state-disabled:hover textarea,
.mon-form .radio.state-disabled:hover i,
.mon-form .checkbox.state-disabled:hover i,
.mon-form .toggle.state-disabled:hover i {
	border-color: var( --e-global-input-disabled ); /*#e5e5e5; */
}

/**/
/* submited state */
/**/
.mon-form .message {
	display: none;
	color:  #b3b3b3;
}

.mon-form .message i {
	display: block;
	margin: 0 auto 20px;
	width: 81px;
	height: 81px;
	border: 1px solid  #b3b3b3;
	border-radius: 50%;
	font-size: 30px;
	line-height: 81px;
}
.mon-form.submited fieldset,
.mon-form.submited footer {
	display: none;
}
.mon-form.submited .message {
	display: block;
	padding: 25px 30px;
	background: rgba(255,255,255,.9);
	font: 300 18px/27px 'Open Sans', Helvetica, Arial, sans-serif;
	text-align: center;
}

/**/
/* datepicker */
/**/
.ui-datepicker {
	display: none;
	padding: 10px 12px;
	background: rgba(255,255,255,0.9);
	box-shadow: 0 0 10px rgba(0,0,0,.3);
	font: 13px/1.55 'Open Sans', Helvetica, Arial, sans-serif;
	text-align: center;
	color: #666;
}
.ui-datepicker a {
	color: #5f5f5f;
}
.ui-datepicker-header {
	position: relative;
	margin: -10px -12px 10px;
	padding: 10px;
	border-bottom: 1px solid rgba(0,0,0,.1);
	font-size: 15px;
	line-height: 27px;
}
.ui-datepicker-prev, 
.ui-datepicker-next {
	position: absolute;
	top: 0;
	display: block;
	width: 47px;
	height: 47px;
	font-size: 15px;
	line-height: 47px;
	text-decoration: none;
	cursor: pointer;
}
.ui-datepicker-prev {
	left: 0;
}
.ui-datepicker-next {
	right: 0;
}
.ui-datepicker-calendar {
	border-collapse: collapse;
	font-size: 13px;
	line-height: 27px;
}
.ui-datepicker-calendar th {
	color: #999;
}
.ui-datepicker-calendar a,
.ui-datepicker-calendar span {
	display: block;
	width: 31px;
	margin: auto;
	text-decoration: none;
	color: #5f5f5f;
}
.ui-datepicker-calendar a:hover {
	background: rgba(0,0,0,.05);	
}
.ui-datepicker-calendar span {
	color: #bfbfbf;
}
.ui-datepicker-today a {
	font-weight: 700;
}
.ui-datepicker-calendar .ui-state-active {
	background: rgba(0,0,0,.05);
	cursor: default;	
}
.ui-datepicker-inline {
	border: 2px solid #e5e5e5;
	background: #fff;
	box-shadow: none;
}
.ui-datepicker-inline .ui-datepicker-calendar {
	width: 100%;
}


.tab-content > div:last-child{display:none;}

.mon-form .forgot{margin-top:-20px;text-align:right;}

.mon-form .req_pass{
        border:0;
        outline:none;
        border-radius:0;
        padding:15px 0;
        font-size: 1.5rem;
        font-weight:600;
        text-align:center;
        text-transform: uppercase;
        letter-spacing:.1em; 
        background: #3caf1d;
        color: #ffffff;
        -webkit-transition:all 0.5s ease;
        transition:all 0.5s ease;
        -webkit-appearance:none;
        display:block;
        width:100%;
	}

.mon-form .req_pass1:hover,.req_pass1:focus{background:#0e8a29;}

.mon-form .col-33 {
	padding-right: 10px;
}


/* *************************
*  Radio Button
***************************/
:root {
    --e-global-accentcolor:#5d6a6f;
    --e-global-lightcolor:#fff;
    --e-global-darkcolor: #444;
    --e-global-labelbkcolor: rgba(248, 248, 248);
    --e-global-radioinp: #8c9599;
    --e-global-labelborder:  #5d6a6f;
}

.radiobtn {
  position: relative;
  display: block;
}
.radiobtn label {
  display: block;
  background: var( --e-global-labelbkcolor );
  color: var( --e-global-darkcolor );
  border-radius: 5px;
  padding: 10px 20px;
  border: 2px solid var( --e-global-labelborder );

  margin-bottom: 5px;
  cursor: pointer;
}
.radiobtn label:after, .radiobtn label:before {
  content: "";
  position: absolute;
  right: 11px;
  top: 11px;
  width: 20px;
  height: 20px;
  border-radius: 3px;
  background: var( --e-global-radioinp );
}
.radiobtn label:before {
  background: transparent;
  transition: 0.1s width cubic-bezier(0.075, 0.82, 0.165, 1) 0s, 0.3s height cubic-bezier(0.075, 0.82, 0.165, 2) 0.1s;
  z-index: 2;
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: 13px;
  background-position: center;
  width: 0;
  height: 0;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNS4zIDEzLjIiPiAgPHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE0LjcuOGwtLjQtLjRhMS43IDEuNyAwIDAgMC0yLjMuMUw1LjIgOC4yIDMgNi40YTEuNyAxLjcgMCAwIDAtMi4zLjFMLjQgN2ExLjcgMS43IDAgMCAwIC4xIDIuM2wzLjggMy41YTEuNyAxLjcgMCAwIDAgMi40LS4xTDE1IDMuMWExLjcgMS43IDAgMCAwLS4yLTIuM3oiIGRhdGEtbmFtZT0iUGZhZCA0Ii8+PC9zdmc+);
}
.radiobtn input[type=radio] {
  display: none;
  position: absolute;
  width: 100%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.radiobtn input[type=radio]:checked + label {
  background: var( --e-global-radioinp );
  -webkit-animation-name: blink;
          animation-name: blink;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  border-color: var( --e-global-accentcolor );
}
.radiobtn input[type=radio]:checked + label:after {
  background: var( --e-global-accentcolor );
}
.radiobtn input[type=radio]:checked + label:before {
  width: 20px;
  height: 20px;
}

@-webkit-keyframes blink {
  0% {
    background-color: var( --e-global-radioinp );
  }
  10% {
    background-color: var( --e-global-radioinp );
  }
  11% {
    background-color: var( --e-global-labelborder );
  }
  29% {
    background-color: var( --e-global-labelborder );
  }
  30% {
    background-color: var( --e-global-radioinp );
  }
  50% {
    background-color: var( --e-global-labelborder );
  }
  45% {
    background-color: var( --e-global-radioinp );
  }
  50% {
    background-color: var( --e-global-labelborder );
  }
  100% {
    background-color: var( --e-global-radioinp );
  }
}

@keyframes blink {
  0% {
    background-color: var( --e-global-radioinp );
  }
  10% {
    background-color: var( --e-global-radioinp );
  }
  11% {
    background-color: var( --e-global-labelborder );
  }
  29% {
    background-color: var( --e-global-labelborder );
  }
  30% {
    background-color: var( --e-global-radioinp );
  }
  50% {
    background-color: var( --e-global-labelborder );
  }
  45% {
    background-color: var( --e-global-radioinp );
  }
  50% {
    background-color: var( --e-global-labelborder );
  }
  100% {
    background-color: var( --e-global-radioinp );
  }
}

@media only screen and (max-width:499px) and (min-width:310px)
{
	.mon-form h1 {
		font-size: 16px;
		line-height: 1.1;
		font-weight:600;
		margin : 10px 0;
	}
	.mon-form .col-25{width:80%;}
	.mon-form .col-33{width:85%;}
	.mon-form .col-50{width:90%;}
	.mon-form .col-100{width:100%;}
	.mon-form .forgot a{
		font-size: .85em;
	}
	.mon-form fieldset {
		display: block;	
		padding: 15px 5px;
		border: none;
		background: rgba(255,255,255,.9);
	}
	.mon-form .button {
		font-size: .9em;
	}
	.mon-form .input input,
	.mon-form .textarea textarea {
		font-size: .8em;
	}
	.mon-form .radio,
	.mon-form .checkbox {
		font-size: .8em;
	}
	
}

@media screen and (max-width: 600px) {
	.mon-form .col {
		float: none;
		width: 100%;
	}
}


div.scroll {
	margin: 4px 4px 10px 4px;
	padding: 2px;
	background-color: white;
	max-width: 1198px;
	height: 260px;
	overflow-x: hidden;
	overflow-y: auto;
	text-align:justify;
}

/******************************************************* */
/** Bouton carré en haut regrouper en liste */

.tab-group{
	margin : 0px;
	list-style:none;
	padding: 0px;
	
}

.tab-group:after{
	content:"";
	display:table;
	clear:both;
}
 
 /*.tab-group ul {
	display: table;
}

.tab-group li {
	display: table-row;
}*/

.tab-group ul { display: table; } /* Behave as table */
.tab-group ul > li { display: table-cell; vertical-align: bottom; }


.tab-group li a{
	display: block;
	font-family: Helvetica;
	text-decoration:none;
	font-size: 24px;
	font-weight: 600;
	text-align:center;
	padding: 6px; /*20*/
	background: var(  --e-global-group ); 
	color:#000;
	float:left;
	width:50%; /*100*/
	cursor:pointer;
	-webkit-transition:.5s ease;
	transition:.5s ease;
}

.tab-group li a:hover{
	background:#5f5f5f;
	color:#ffffff;
} 
.tab-group .active a{
	background:#5d6a6f;
	color:#ffffff;
}  

@media only screen and (max-width:499px) and (min-width:310px)
{
	.tab-group li a{
		font-size: .9em;
	}

} /* Media pour tab-group */
/******************************************************* */
/** Bouton au coin arrondi à mettre en bas du formulaire */
.bouton-chx {
   background: #BBBABA;
   background-image: -webkit-linear-gradient(top, #BBBABA, #5F5F5F);
   background-image: -moz-linear-gradient(top, #BBBABA, #5F5F5F);
   background-image: -ms-linear-gradient(top, #BBBABA, #5F5F5F);
   background-image: -o-linear-gradient(top, #BBBABA, #5F5F5F);
   background-image: -webkit-gradient(top bottom, #BBBABA, #5F5F5F);
   -webkit-border-radius: 16px; /*20*/
   -moz-border-radius: 16px;
   border-radius: 16px;
   color: #FFFFFF;
   font-family: Helvetica;
   font-size: 32px;	/*40*/
   font-weight: 600;
   margin-right: 10px; 
   padding: 14px; /*20*/
   -webkit-box-shadow: 1px 1px 20px 0 #000000;
   -moz-box-shadow: 1px 1px 20px 0 #000000;
   box-shadow: 1px 1px 20px 0 #000000;
   text-shadow: 1px 1px 20px #000000;
   border: solid #5F5F5F 1px;
   text-decoration: none;
   display: inline-block;
   cursor: pointer;
   text-align: center;
}
.bouton-chx:disabled,
.bouton-chx:disabled:hover
 {
   background: #D1D1D1;
   background-image: -webkit-linear-gradient(top, #D1D1D1, #7E7D7D);
   background-image: -moz-linear-gradient(top, #D1D1D1, #7E7D7D);
   background-image: -ms-linear-gradient(top, #D1D1D1, #7E7D7D);
   background-image: -o-linear-gradient(top, #D1D1D1, #7E7D7D);
   background-image: -webkit-gradient(to bottom, #D1D1D1, #7E7D7D);
   color: rgba(255, 255, 255, 0.18);
   -webkit-box-shadow: 1px 1px 20px 0 #000000;
   -moz-box-shadow: 1px 1px 20px 0 #000000;
   box-shadow: 1px 1px 20px 0 #000000;
   text-shadow: 1px 1px 20px #000000;
   border: solid #5F5F5F 1px;
}

.bouton-chx:hover {
	border: solid #BBBABA 2px;
	background: #5F5F5F;
	background-image: -webkit-linear-gradient(top, #5F5F5F, #BBBABA);
	background-image: -moz-linear-gradient(top, #5F5F5F, #BBBABA);
	background-image: -ms-linear-gradient(top, #5F5F5F, #BBBABA);
	background-image: -o-linear-gradient(top, #5F5F5F, #BBBABA);
	background-image: -webkit-gradient(to bottom, #5F5F5F, #BBBABA);

}
.mon-form .button-multi{
	display: inline-block;
	width: auto;
	padding : 20px;
	margin-right : 20px;
}
@media 
only screen and (max-width: 500px),
(min-device-width: 300px) and (max-device-width: 500px)  {

	.bouton-chx,
	.bouton-chx:disabled{
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
		color: #FFFFFF;
		font-family: Helvetica;
		font-size: 20px;
		font-weight: 600;
		margin-right: 2px;
		padding: 6px;
		-webkit-box-shadow: 1px 1px 10px 0 #000000;
		-moz-box-shadow: 1px 1px 10px 0 #000000;
		box-shadow: 1px 1px 10px 0 #000000;
		text-shadow: 1px 1px 10px #000000;
		border: solid #5F5F5F 1px;
	}
} /* Ecran mobile*/
/******************************************************* */
******************************************************* */
/** Bouton carré en haut regrouper en liste */

.multitab-group{
	display: table;
    width: 98%;
	margin : 0px;
	list-style:none;
	padding: 0px;
}

.multitab-group:after{
	content:"";
	display:table;
	clear:both;
}
 
.multitab-group ul { display: table; } /* Behave as table */
.multitab-group ul > li { display: table-cell; vertical-align: bottom;  }

.multitab-group li  {
    display: table-cell;
	line-height : 1.5 !important;
}

.multitab-group li a{
	display: block;
	font-family: Helvetica;
	text-decoration:none;
	font-size: 20px; /**/
	font-weight: 600;
	text-align:center;
	padding: 4px; /*20*/
	background: var(  --e-global-group ); 
	color:#000;
	width: auto;
	block-size: fit-content;
	margin-right : 2px;
	cursor:pointer;
	-webkit-transition:.5s ease;
	transition:.5s ease;
}

.multitab-group li a:hover{
	background:#5f5f5f;
	color:#ffffff;
} 
.multitab-group .active a{
	background:#5d6a6f;
	color:#ffffff;
}  

#horizontal-style {
    display: table;
    width: 98%;
}

@media only screen and (max-width:499px) 
{

	div.scroll {
		margin: 0;
		padding: 0;
	}
} /* Media pour tab-group */

@media only screen and (min-width: 837px) {
	.multitab-group li a{
		font-size: 24px;
		font-weight: 600;
	}
}

@media only screen and (max-width:836px) 
{
	.multitab-group li a{
		font-size: .9em;
	}
}

@media only screen and (max-width:710px)
{
	.multitab-group li a{
		font-size: .6em;
	}
}

@media only screen and (max-width:755px)
{
	.multitab-group li a{
		font-size: .4em;
	}
}

.inputvoid { 
	font-style:italic !important; 
	font-weight:normal; 
}

.inputvoid:disabled { 
	color : var( --e-global-input-disabled ) !important;
}

.griser {
	background-color: #CCCCCC !important;
}

.disable {
    pointer-events:none; /*This makes it not clickable*/
    opacity:0.5;         /*This grays it out to look disabled*/
	font-style:italic !important; 
	font-weight:normal; 
}

.tdright {
	text-align: right;
 }

 .tdleft {
	text-align: left;
 }

.Icon-outside {
	position:relative;
}

.Icon-outside i {
	font-size : 34px;
	position:absolute;
	margin-left:-6px;
	/*margin-bottom:18px;*/
	top:4px;
	padding: 6px;
	/*padding: 15px 15px;*/
	color:	#fff;
	border-radius:25px;
}

.fondrouge{
	background: red;
}
.fondvert{
	background: green;
}
.fondgris{
	background: var(--e-global-group);
}

.GrosGras {
	font-size : 1.5rem;
	font-weight: 700; 
	margin-top:10px;
}


.fa-abacus:before {
	margin-top : 10px !important;
  	content: url(../img/abacus.ico); 
}

.fa-quebec:before {
	padding-top : 5px !important;
  	content: url(../img/quebec.ico); 
}
.fa-quebec_blu:before {
	padding-top : 5px !important;
  	content: url(../img/quebec_blu.ico); 
}
.fa-province:before {
	padding-top : 5px !important;
  	content: url(../img/prov.ico); 
}
.fa-codepostal:before {
	padding-top : 5px !important;
  	content: url(../img/codepostal.ico); 
}
.fa-ccq:before {
	padding-top : 5px !important;
  	content: url(../img/ccq.ico); 
}
.fa-boulier:before {
	padding-top : 5px !important;
  	content: url(../img/abacus.ico); 
}
.mon-form .icon-append .fa-quebec{
	top:9px !important;
}

/* ***** DEFINITION POUR LE POINT ROND A GAUCHE ****** */
.petitinfo1 .petitinfotext1 {
    top: auto;
    left: 60%;
    margin-left: -60px;
	padding : 0px 4px 0px 4px;
}
.dot {
	color: transparent;
	height: 25px;
	width: 25px;
	background: var(  --e-global-dot ); 
	border-radius: 50%;
	display: inline-block;
}

.dot:hover{
	background:#5f5f5f;
	
} 
.dot:active {
	background:#5d6a6f;
	
}